import React/*, {
	PureComponent
}*/ from 'react'
import pathToRegexp from 'path-to-regexp'
// import { Layout } from 'antd'
// import { connect } from 'dva'
import NProgress from 'nprogress'
import 'nprogress/nprogress.css'
import Authorized from '@/components/Authorized'
import Exception from '@/pages/exception/403';

// import SiderMenu from '@/components/SiderMenu'

// const { Content } = Layout

// const BasicLayout = ({ menu, children }) => {
// 	return (
// 		<Layout>
// 			<SiderMenu menu={menu}></SiderMenu>
// 			<Layout style={{minHeight: '100vh'}}>
// 				<Content>{children}</Content>
// 			</Layout>
// 		</Layout>
// 	)
// }

import SiderMenu from '@/components/SiderMenu'
import Header from './Header'

let lastPath = ''

const getRouterAuthority = (pathname, routeData) => {
	let routeAuthority = [];
	const getAuthority = (key, routes) => {
		routes.forEach(route => {
			if (route.path && pathToRegexp(route.path).test(key)) {
				routeAuthority = route.authority;
			} else if (route.routes) {
				routeAuthority = getAuthority(key, route.routes);
			}
			return route;
		});
		return routeAuthority;
	};
	return getAuthority(pathname, routeData);
};

const BasicLayout = ({ children, loading, ...props }) => {
	const {
		user: {
			authorities = []
		},
		location,
		route: { 
			routes 
		}
	} = props

	const path = location.pathname + location.search
    if (path !== lastPath) {
      NProgress.start()
    }

    if (!loading.global) {
      NProgress.done()
      lastPath = path
    }
    const authority = getRouterAuthority(location.pathname, routes)
	return (
		<div className="section">
			<div className="aside">
				<div className="aside-body">
					<div className="aside-tab">
						<div className="aside-panel">
							{/*<div className="aside-logo"></div>*/}
							<div className="aside-nav">
								<SiderMenu {...props} tooltip></SiderMenu>
							</div>
						</div>
						<div className="aside-nav aside-footer">
							<SiderMenu {...props} system={true}></SiderMenu>
						</div>
					</div>
				</div>
			</div>
			<Header />
			<div className="primary">
				<Authorized authorities={authorities} authority={authority} noMatch={<Exception />}>
					{children}
				</Authorized>
			</div>
		</div>
	)
}

// class BasicLayout extends PureComponent {
// 	componentDidMount() {
// 		const {
// 			dispatch
// 		} = this.props
// 		dispatch({
// 			type: 'user/fetchCurrent'
// 		})
// 	}
// 	render() {
// 		const {
// 			children
// 		} = this.props
// 		return (
// 			<Layout>
//  				{children}
//  			</Layout>
// 		)
// 	}
// }

// export default connect(({ app: { menu=[], user={}, }, loading }) => ({
// 	menu,
// 	user,
// 	loading
// }))(BasicLayout)
export default BasicLayout